<template>
	<view>
		<view class="login-container" :style="{'height': windowInfo + 'px'}">
			<uni-icons type="contact-filled" size="100" color="#AFAFAF"></uni-icons>
			<button type="primary" v-if="canIUseGetUserProfile" @click="getUserProfile" class="btn-login">一键登录</button>




			<button type="primary" class="account-number" @click="login">账号登录</button>
			<view class="tips-text">登录后尽享更多权益</view>
		</view>
	</view>

</template>

<script>
	import {
		mapMutations,
		mapState
	} from "vuex"
	export default {
		name: "myLogin",
		data() {
			return {
				windowInfo: uni.getWindowInfo().windowHeight,
				userInfo: {},
				hasUserInfo: false,
				canIUseGetUserProfile: false,


			};
		},
		mounted() {
			if (this.accountNumber.length == 0) {
				let data = new Date()

				let year = data.getFullYear()
				let Month = data.getMonth()
				let Day = data.getDay()
				let Hours = data.getHours()
				let Minutes = data.getMinutes()
				let time = year + '-' + Month + '-' + Day + ':' + Hours + '-' + Minutes

				this.addAccountNumber({
					username: 'admin',
					password: '123456',
					phone: '15678831312',
					time: time,
				})
			}

			if (uni.getUserProfile) {
				this.canIUseGetUserProfile = true
			}

		},
		computed: {
			...mapState('login', ["accountNumber"])

		},
		methods: {
			...mapMutations("login", ["updateUserInfo", "updateToken", "addAccountNumber"]),
			getUserProfile(e) {
				uni.getUserProfile({
					desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						this.userInfo = res.userInfo
						this.userInfo.phone = "15678831312"
						let data = new Date()
						let year = data.getFullYear()
						let Month = data.getMonth()
						let Day = data.getDay()
						let Hours = data.getHours()
						let Minutes = data.getMinutes()
						this.userInfo.time = year + '-' + Month + '-' + Day + ':' + Hours + '-' + Minutes
						this.updateUserInfo(this.userInfo)

						//  // 获取登录成功后的 Token 字符串
						this.getToken(res)

					},
					fail: () => {
						uni.$showToast('您取消了登录授权！', "error")
					}
				})
			},


			 getToken(info) {
				uni.login({
					success: (res) => {
						if (res.code) {
					
							//发起网络请求
							// const query = {
							// 	code: res.code,
							// 	encryptedData: info.encryptedData,
							// 	iv: info.iv,
							// 	rawData: info.rawData,
							// 	signature: info.signature
							// }
							//接口问题，请求失败
							// const {
							// 	data: loginResult
							// } = await uni.$http.post('/api/public/v1/users/wxlogin', query)
						
							// if (loginResult.meta.status !== 200) return uni.$showToast('登录失败！', "error")
							const token =
								"Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjIzLCJpYXQiOjE1NjQ3MzAwNzksImV4cCI6MTAwMTU2NDczMDA3OH0.YPt-XeLnjV-_1ITaXGY2FhxmCe4NvXuRnRB8OMCfnPo"
							this.updateToken(token)
							uni.$showToast('登录成功！')
						} else {
							uni.$showToast('登录失败！', "error")
						}
					}
				})
			},
			login() {
				uni.navigateTo({
					url: "/subUserInfo/loginRegistration/loginRegistration"
				})
			},

		},


	}
</script>

<style lang="scss">
	.login-container {
		// 登录盒子的样式

		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #f8f8f8;
		position: relative;
		overflow: hidden;


		// 绘制登录盒子底部的半椭圆造型
		&::after {
			content: ' ';
			display: block;
			position: absolute;
			width: 100%;
			height: 80rpx;
			left: 0;
			bottom: 0;
			background-color: white;
			border-radius: 100%;
			transform: translateY(50%);
		}

		// 登录按钮的样式
		.btn-login {
			width: 90%;
			border-radius: 200rpx;
			margin: 30rpx 0;
			background-color: #c00000;
		}

		.account-number {
			width: 90%;
			border-radius: 200rpx;
			margin-bottom: 20px;
			background-color: #3c9cff;
		}

		// 按钮下方提示消息的样式
		.tips-text {
			font-size: 24rpx;
			color: gray;
		}
	}
</style>